import React from 'react';
import { PureComponent } from "react";
import { Layout, Row, Col, Menu, Select, Button, Carousel, Anchor } from 'antd';

import { Link } from 'react-router-dom';
import logo from './logo.svg';
import './App.css';
import Product from './product.png';
import Why from './why.png';
import Relation from './relation.png';
import OurParter from './ourParter.png';
const { Header, Footer, Sider, Content } = Layout;
const { SubMenu } = Menu;
const { Option } = Select;
const product = {
    backgroundSize: '100% 60px',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'center 29px',
    backgroundImage: 'url(' + Product + ')',
    height: '105px',
    width: '787px',
    margin: '0px auto 0px',
    textAlign: 'center',
    fontSize: '32px',
    fontWeight: 'bold',
    color: '#151515',

}
const why = {
    backgroundSize: '100% 60px',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'center 29px',
    backgroundImage: 'url(' + Why + ')',
    height: '105px',
    width: '365px',
    margin: '0px auto 0px',
    textAlign: 'center',
    fontSize: '32px',
    fontWeight: 'bold',
    color: '#151515',

}
const relation = {
    backgroundSize: '100% 240px',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: '0px 0px',
    backgroundImage: 'url(' + Relation + ')',
    height: '240px',
    width: '100%',
    fontSize: '32px',
    color: '#fff',
    lineHeight: '240px',
    paddingLeft: '360px'


}

export default class App extends PureComponent {
    constructor(props) {
        super(props)
        this.state = {
            current: '0',
            IsmouseOver: false,
            IsmouseOverAnroid: false,
            IsFooter1: false,
            IsFooter2: false,
            IsFooter3: false,
            IsFooter4: false,
            uopsColor: false,
        }
    };
    componentWillMount() {

    };
    componentDidMount() {
        localStorage.setItem("path", this.props.match.path)
        console.log(this.props.match.path)
    };
    handleChange = (value) => {
        console.log(`selected ${value}`);
    }
    mouseOver = () => {
        this.setState({
            IsmouseOver: true
        })
    }
    mouseOverAnroid = () => {
        this.setState({
            IsmouseOverAnroid: true
        })
    }
    mouseOut = () => {
        this.setState({
            IsmouseOver: false
        })
    }
    mouseOutAnroid = () => {
        this.setState({
            IsmouseOverAnroid: false
        })
    }
    footer1Over = () => {
        this.setState({
            IsFooter1: true
        })
    }
    footer1Out = () => {
        this.setState({
            IsFooter1: false
        })
    }
    footer2Over = () => {
        this.setState({
            IsFooter2: true
        })
    }
    footer2Out = () => {
        this.setState({
            IsFooter2: false
        })
    }
    footer3Over = () => {
        this.setState({
            IsFooter3: true
        })
    }
    footer3Out = () => {
        this.setState({
            IsFooter3: false
        })
    }
    footer4Over = () => {
        this.setState({
            IsFooter4: true
        })
    }
    footer4Out = () => {
        this.setState({
            IsFooter4: false
        })
    }
    uposClick = () => {

        window.location.href = "/upos/";


    }
    questionClick = () => {
        window.location.href = "/question/";
    }
    chatClick = () => {
        window.location.href = "/chat/";
    }
    backTop = () => {
        window.scrollTo({
            top: 0,
            behavior: 'smooth'
        })
    }
    render() {
        let { current, IsmouseOver, IsmouseOverAnroid, IsFooter1, IsFooter2, IsFooter3, IsFooter4, uopsColor } = this.state;
        return (
            <Layout style={{ background: '#fff', minWidth: '1500px', overflow: 'auto', width: '100%' }}>
                <Header style={{ width: '100%' }}>
                    <Row>
                        <Col span={4}></Col>
                        <Col span={16} >

                            <Row style={{ width: '100%' }}>
                                <Col span={4}> <img src="images/header.png" style={{ width: '143px', height: '26px' }} /></Col>
                                <Col span={9}>
                                    <img src="images/slogan.png" style={{ width: '190px', height: '48px' }}></img>
                                </Col>
                                <Col span={11} style={{ position: 'relative' }}>
                                    <img src="images/arrowDown.png" style={{ width: '24px', position: 'absolute', top: '19px', left: '140px' }}></img>
                                    <Menu mode="horizontal" selectedKeys={[current]} >
                                       
                                        <Menu.Item key="0">
                                            <Link to="/" style={{ fontWeight: 'bold', color: '#2B292D' }}>首页</Link>
                                        </Menu.Item>
                                        <SubMenu key="sub1"  title="产品中心" >
                                           
                                            <Menu.Item key="1">
                                               
                                                <Link to="/upos/"> 进销存管理系统</Link>
                                                </Menu.Item>
                                            <Menu.Item key="2">
                                                <Link to="/pos/">收银系统</Link>
                                            </Menu.Item>
                                            <Menu.Item key="3">
                                                <Link to="/posApp/">在线商城APP</Link>
                                            </Menu.Item>
                                            
                                        </SubMenu>
                                        {/* <Menu.Item key="1">
                                            <Link to="/upos/">产品中心</Link>
                                        </Menu.Item> */}
                                        {/* <Menu.Item key="2">
                                        <Link to="/pos/">POS收银系统</Link>
                                    </Menu.Item>
                                    <Menu.Item key="3">
                                       <Link to="/posApp/">UPOS APP</Link>
                                    </Menu.Item> */}
                                        <Menu.Item key="4">
                                            <Link to="/question/">解决方案</Link>
                                        </Menu.Item>
                                        <Menu.Item key="5">
                                            <Link to="/chat/">关于我们</Link>
                                        </Menu.Item>

                                    </Menu>
                                </Col>
                            </Row>
                        </Col>
                        <Col span={4}></Col>
                        {/*<Col span={5}>*/}
                        {/*<Select defaultValue="zh" style={{ width: 120 }} onChange={this.handleChange}>*/}
                        {/*<Option  key="en" value="zh" >*/}
                        {/*<div className="demo-option-label-item" style={{fontSize:'1.2rem'}}>*/}
                        {/*<span role="img" aria-label="ZH">*/}
                        {/*<img src="images/china.png" style={{width:'1.6rem',height:'1.6rem',marginRight:'0.3rem'}}/>*/}
                        {/*</span>*/}
                        {/*CN*/}
                        {/*</div>*/}
                        {/*</Option>*/}
                        {/*<Option  key="it" value="it">*/}
                        {/*<div className="demo-option-label-item" style={{fontSize:'1.2rem'}}>*/}
                        {/*<span role="img" aria-label="IT">*/}
                        {/*<img src="images/Italy.png" style={{width:'1.6rem',height:'1.6rem',marginRight:'0.3rem'}}/>*/}
                        {/*</span>*/}
                        {/*IT*/}
                        {/*</div>*/}
                        {/*</Option>*/}
                        {/*</Select>*/}
                        {/*</Col>*/}
                        {/*<Col span={2}></Col>*/}
                    </Row>
                </Header>
                <Content>
                    <div style={{ width: '100%' }}>
                        <img src="images/banner2.png" style={{ width: '100%' }}></img>
                    </div>
                    <div className='banner' style={{ padding: '104px 0px' }}>
                        <div style={{width:'1200px',margin:'0 auto'}}>
                            <div style={product}>UPOS 云进销存核心产品</div>
                            <div style={{ overflow: 'hidden', margin: '60px 0 0px' }}>
                                <div style={{ float: 'left', width: '380px',  background: '#fff', paddingBottom: '60px' }}>
                                    <img src='images/uposBg.png' style={{ width: '364px' }}></img>
                                    <p style={{ fontSize: '18px', color: '#151515', textAlign: 'center', fontWeight: 'bold', marginTop: '31px' }}>进销存管理系统</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>集采购、销售、库存 和 财务</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>为一体的超市进销存系统。</p>
                                </div>
                                <div style={{ float: 'left', width: '380px', margin: '0px 0px 0px 30px', background: '#fff', paddingBottom: '60px' }}>
                                    <img src='images/uposBg1.png' style={{ width: '364px' }}></img>
                                    <p style={{ fontSize: '18px', color: '#151515', textAlign: 'center', fontWeight: 'bold', marginTop: '31px' }}>收银系统</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>对线下收银功能重新设计布局，</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>员工操作2次既可上手。</p>
                                </div>
                                <div style={{ float: 'left', width: '380px', margin: '0px 0px 0px 30px', background: '#fff', paddingBottom: '60px' }}>
                                    <img src='images/uposBg2.png' style={{ width: '364px' }}></img>
                                    <p style={{ fontSize: '18px', color: '#151515', textAlign: 'center', fontWeight: 'bold', marginTop: '31px' }}>在线商城APP</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>与线下数据互通，支持社区客户</p>
                                    <p style={{ fontSize: '16px', color: '#4E5155', textAlign: 'center', margin: '0px' }}>手机订货、到店取货。</p>
                                </div>
                            </div>
                        </div>
                      
                    </div>
                    <div style={{ background: '#fff', padding: '104px 0px' }}>
                        <div style={{width:'1040px',margin:'0 auto'}}>
                        <div style={why}>选择我们的理由</div>
                        <div style={{ overflow: 'hidden', padding: '168px 0px 0px 0px' }}>
                            <div style={{ float: 'left', marginTop: '40px' }}>
                                <img src="images/why1.png" style={{ width: '201px' }}></img>
                            </div>
                            <div style={{ float: 'left', marginLeft: '387px',width:'452px' }}>
                                <p style={{ fontSize: '28px', color: '#151515' }}>商品入库</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>采购到货后，可以直接导入供应商提供的电子到货单； </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>支持导入目前意大利税务局公布的十种商品税率； </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>一次导入实现：零售价设置、利润设置及商品入库；  </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span> 货架标签支持两种A4模板和两种专用标签纸模板；  </p>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div style={{ padding: '80px 0px' }} className='banner1'>
                        <div style={{width:'1040px',margin:'0 auto'}}>
                        <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }} className='transform'>
                            <div style={{ float: 'left',width:'478px' }}>
                                <p style={{ fontSize: '28px', color: '#151515' }}>库存管理</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>滞销商品报表列出3个月以上的滞销商品清单和库存金额；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>库存预警设置方便，系统实时更新商品库存状态；  </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>采购、销售记录全程跟踪记录，可查看商品库存流水；   </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span> 使用手机就能实现库存盘点的工作，省时省钱； </p>
                            </div>
                            <div style={{ float: 'left', marginLeft: '361px' }}>
                                <img src="images/why2.png" style={{ width: '201px' }}></img>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div style={{ background: '#fff', padding: '80px 0px' }}>
                        <div style={{width:'1040px',margin:'0 auto'}}>
                        <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }}>
                            <div style={{ float: 'left', marginTop: '40px' }}>
                                <img src="images/why3.png" style={{ width: '201px' }}></img>
                            </div>
                                <div style={{ float: 'left', marginLeft: '387px', width: '452px' }}>
                                <p style={{ fontSize: '28px', color: '#151515' }}>客户管理</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>同一客户等级，只需设置一次折扣； </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>批发客户购买商品后，系统支持开具电子发票；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>根据客户的消费情况，出具客户购买力报表；  </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span> 提供流失客户报表，门店可查看并采取相应措施；  </p>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div style={{ padding: '80px 0px' }} className='banner1'>
                         <div style={{width:'1040px',margin:'0 auto'}}>
                        <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }} className='transform'>
                            <div style={{ float: 'left',width:'452px' }}>
                                <p style={{ fontSize: '28px', color: '#151515' }}>活动促销</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>门店设置活动时间段，系统自动执行和结束活动； </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>打折活动提供2种价格输入方式，系统提供活动标签；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>优惠券可以按客户群体发放，精准定位活动客户；    </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span> 查看优惠券发放和使用记录，直观了解活动效果； </p>
                            </div>
                            <div style={{ float: 'left', marginLeft: '387px' }}>
                                <img src="images/why4.png" style={{ width: '201px' }}></img>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div style={{ background: '#fff', padding: '80px 0px' }}>
                         <div style={{width:'1040px',margin:'0 auto'}}>

                        <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }}>
                            <div style={{ float: 'left', marginTop: '40px' }}>
                                <img src="images/why5.png" style={{ width: '201px' }}></img>
                            </div>
                                <div style={{ float: 'left', marginLeft: '348px', width: '491px' }}>
                                <p style={{ fontSize: '28px', color: '#151515' }}>手机报表</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>老板移动端，可使用手机随时查看门店经营数据； </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>重要数据一张界面展示，直观了解异常和营业情况；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>可查看各时段的商品销量情况，辅助决策货架摆放策略；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span> 退货报表可帮助门店查看频繁退货的商品，提供采购建议；  </p>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div >
                        <div style={{ padding: '80px 0px' }} className='banner1'>
                             <div style={{width:'1040px',margin:'0 auto'}}>

                            <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }} className='transform'>
                                <div style={{ float: 'left',width:'491px' }}>
                                    <p style={{ fontSize: '28px', color: '#151515' }}>线下收银</p>
                                    <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>提供快捷商品栏，只需点击一下既可添加商品；  </p>
                                    <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>扫码同步展示商品图片，便于收银员确认商品信息；</p>
                                    <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span>常用货币一键结账，无需输入金额，点击一下完成收款；    </p>
                                    <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#B9C5F2', display: 'inline-block', marginRight: '8px' }}></span> 大屏客显提升门店形象，提高客户好感度，打消价格疑虑；</p>
                                </div>
                                <div style={{ float: 'left', marginLeft: '348px' }}>
                                    <img src="images/why6.png" style={{ width: '201px' }}></img>
                                </div>
                            </div>
                        </div>
                        </div>
                    </div>

                    <div style={{ background: '#fff', padding: '80px 0px' }}>
                         <div style={{width:'1040px',margin:'0 auto'}}>

                        <div style={{ overflow: 'hidden', padding: '0px 0px 0px 0px' }}>
                            <div style={{ float: 'left', marginTop: '40px' }}>
                                <img src="images/why7.png" style={{ width: '201px' }}></img>
                            </div>
                                <div style={{ float: 'left', marginLeft: '387px', width: '452px' }}>
                                <p style={{ fontSize: '28px', color: '#151515', fontWeight: '500', fontFamily: 'PingFangSC-Medium, PingFang SC' }}>帮助门店布局线上</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '40px 0px 10px', fontWeight: '500' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>一键点击即可将商品上架到在线商城，简单方便；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px', fontWeight: '500' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>提供热销商品展示位，增加曝光度，加速库存流转；</p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 10px', fontWeight: '500' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span>库存数据与线下同步，防止出现商品超卖的情况；  </p>
                                <p style={{ fontSize: '18px', color: '#151515', margin: '20px 0px 0px', fontWeight: '500' }}><span style={{ width: '10px', height: '10px', borderRadius: '50%', background: '#0487FC', display: 'inline-block', marginRight: '8px' }}></span> 中意语言随意切换，华人老外都能看得懂，会使用； </p>
                            </div>
                        </div>
                        </div>
                    </div>
                    <div style={relation}>
                        <div style={{width:"1040px,margin:'0 auto"}}>还有更多功能，请联系下方的销售专员...</div>
                        
                    </div>
                    <div style={{width:'1200px',margin:'0 auto'}}>
                        <div style={ourParter}>合作伙伴</div>
                        <div style={{ margin: '76px auto 104px', width: '1200px' }}>
                            <img src="images/parter.png" style={{ height: '75px' }}></img>
                        </div>
                    </div>
                    

                </Content>
                <Footer style={{ background: '#001123', padding: '81px 0 0 0px', }}>
                    <div style={{ overflow: 'hidden', width:'1200px',margin:'0 auto' }}>
                        <div style={{ float: 'left' }}>
                            <img src="images/logoUpos.png" style={{ width: '143px', height: '26px' }} />
                        </div>
                        <div style={{ float: 'left', borderRight: '1px solid rgb(42,42,42)', padding: '0 90px 0px 196px',width:'588px' }}>
                            <a style={{ color: '#fff', fontSize: '16px', marginRight: '168px', }} className='aHover' >
                                <Link to="/upos/" style={{ color: '#fff', }} onClick={this.backTop}> 产品中心</Link>


                            </a>
                            <a style={{ color: '#fff', fontSize: '16px' ,}} className='aHover' >
                                <Link to="/question/" style={{ color: '#fff', }} onClick={this.backTop}>  解决方案</Link>


                            </a>
                            <p style={{ color: '#999999', fontSize: '14px', marginTop: '22px' }}>进销存管理系统</p>
                            <p style={{ color: '#999999', fontSize: '14px', marginTop: '12px' }}>收银系统</p>
                            <p style={{ color: '#999999', fontSize: '14px', marginTop: '12px' }}>在线商品APP</p>
                            <p style={{ marginTop: '92px', }}>
                                <a style={{ color: '#fff', fontSize: '16px', }} href="/chat/" className='aHover' >
                                    <Link to="/chat/" style={{ color: '#fff', }} onClick={this.backTop}>    关于我们</Link>


                                </a>
                            </p>
                            <p style={{ color: '#999999', fontSize: '14px', marginTop: '22px' }}>杭州青湘科技有限公司</p>
                            <div style={{ margin: '15px 0 0px 0', color: '#999999', fontSize: '14px', }}>
                                <span style={{ height: '16px', paddingRight: '20px', borderRight: '1px solid #999999', }}>杭州</span>
                                <span style={{ height: '16px', padding: '0px 16px 0px 16px', borderRight: '1px solid #999999', }}>上海</span>
                                <span style={{ height: '16px', padding: '0px 16px 0px 16px', borderRight: '1px solid #999999', }}>北京</span>
                                <span style={{ height: '16px', padding: '0px 16px 0px 16px', borderRight: '1px solid #999999', }}>深圳</span>
                                <span style={{ height: '16px', paddingLeft: '20px', }}>威尼斯</span>
                            </div>
                        </div>
                        <div style={{ float: 'left', paddingLeft: '86px', color: '#999999', }}>
                            <p style={{ fontSize: '16px' }}>中国联系方式：</p>
                            <div>
                                <img src="images/weChat.png" style={{ width: '24px', height: '24px' }}></img>
                                <span style={{ fontSize: '14px', marginLeft: '8px' }}>企业微信</span>

                            </div>
                            <div style={{ marginTop: '8px' }}>
                                <img src="images/erweima.png" style={{ width: '104px' }}></img>

                            </div>
                            <p style={{ fontSize: '16px', marginTop: '48px' }}>意大利销售专员：</p>
                            <div>
                                <img src="images/phone.png" style={{ width: '24px', height: '24px' }}></img>
                                <span style={{ fontSize: '14px', marginLeft: '8px' }}>韩先生手机</span>
                            </div>
                            <p style={{ fontSize: '14px', marginTop: '12px', color: '#fff' }}> +39/3778832691</p>
                        </div>
                        <div style={{ float: 'left', marginLeft: '117px', color: '#999', fontSize: '14px', paddingTop: '42px' }}>
                            <div>
                                <img src="images/email.png" style={{ width: '24px', height: '24px', }}></img>
                                <span style={{ fontSize: '14px', marginLeft: '8px' }}>Email</span>
                                <p style={{ color: '#fff', fontSize: '14px', marginTop: '8px' }}>support@imichi.cn</p>
                                <div style={{ marginTop: '172px' }}>
                                    <img src="images/email.png" style={{ width: '24px', height: '24px' }}></img>
                                    <span style={{ fontSize: '14px', marginLeft: '8px' }}>Email</span>
                                </div>
                                <p style={{ fontSize: '14px', marginTop: '12px', color: '#fff' }}>upositalia@gmail.com</p>
                            </div>
                        </div>
                    </div>
                    <div style={{ borderTop: '1px solid rgb(42,42,42)', marginTop: "79px", fontSize: '14px', color: '#999', textAlign: 'center', padding: '20px 0 22px' }}>版权所有 @杭州青湘科技有限公司</div>

                </Footer>

            </Layout>
        );
    }

}


